<template>
  <div class="common-layout">
    <div>
      <a-page-header
        style="border: 1px solid rgb(235, 237, 240)"
        title="题库"
        sub-title="申论题库"
        @back="() => $router.go(-1)"
      />
    </div>

    <div
      class="detail"
      v-for="item in testExplainDetailStore.testexplaindetailDatas"
      :key="item.iid"
    >
      <!-- 题目内容 -->
      <h2>{{ item.question }}</h2>

      <div class="demo-collapse">
        <a-collapse v-model:activeKey="activeKey" accordion>
          <a-collapse-panel key="1" header="点击查看答案">
            <p>{{ item.answer }}</p>
          </a-collapse-panel>
        </a-collapse>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import { useTestExplainDetailStore } from '@/stores/testbank/testexplain/testexplaindetail'
// import { useTestAdminAnswerStore } from '@/stores/testbank/testanswer'
const activeKey = ref([])

import { useRoute, useRouter } from 'vue-router'

const route = useRoute()
const router = useRouter()

const testExplainDetailStore = useTestExplainDetailStore()
// const testAdminAnswerStore = useTestAdminAnswerStore()

// const selectedAnswer = ref<Record<number, string>>({})
const nid = Number(route.params.nid)
// const detailparams = reactive({
//   nid: Number(route.params.nid),
//   answer: selectedAnswer.value,
//   iid: 0,
// })
console.log(nid, '这是要传给后端的参数nid')

// 修改 detailparams 类型
const detailparams = reactive<{
  nid: number
  answer: Record<number, string>
  iid: number
}>({
  nid: Number(route.params.nid),
  answer: {},
  iid: 0,
})

testExplainDetailStore.testExplainDetailResultAction(detailparams)
</script>

<style scoped></style>
